<template>
  <div class="header" @click="dbClick">
    <div class="header-left">
      <span class="header-icon" v-if="showLeft" @click="back"></span>
	  <span class="left_text" v-if="showText">取消</span>
    </div>
    <div class="title" v-text="title"></div>
    <div class="header-right" v-text="rightText" @click="rightEven"></div>
  </div>
</template>

<script>
export default {
  name: 'y-navbar',
  props: {
	showLeft: {
		type: Boolean,
		default: true
	},
	showText: {
		type: Boolean,
		default: false
	},
    title: {
      type: String,
      default: ''
    },
    rightText: {
      type: String,
      default: ''
    }
  },
  data() {
	  return {
		  touchEndTime: 0,
		  touchStartTime: 0
	  }
  },
  methods: {
    back() {
      if(this.$listeners['onBackFun']) {
        console.log('自定义返回')
		this.$emit('onBackFun')
      } else {
        uni.navigateBack({
            delta: 1
        })
      }
    },
	
	dbClick(e) {
		// 控制点击事件在350ms内触发，加这层判断是为了防止长按时会触发点击事件
		if (this.touchEndTime - this.touchStartTime < 350) {
		  // 当前点击的时间
		  var currentTime = e.timeStamp
		  var lastTapTime = this.lastTapTime
		  // 更新最后一次点击时间
		  this.lastTapTime = currentTime
	
		  // 如果两次点击时间在300毫秒内，则认为是双击事件
		  if (currentTime - lastTapTime < 300) {
			// 成功触发双击事件时，取消单击事件的执行
			// console.log('双击事件已触发')
			/* 
				检测端
			 */
			uni.getSystemInfo({
				success: function(res) {
					console.log(res)	
					if(res.model == 'iPhoneX') {
						this.ScrollTop(60, 500)
					}
				}.bind(this)
			}) 
			this.ScrollTop(0, 500)
		  }
		}
	},

    // 右边按钮事件
    rightEven() {
      this.$emit('rightEven')
    },
	
	ScrollTop(number = 0, time) {
	  if (!time) {
		document.body.scrollTop = document.documentElement.scrollTop = number
		return number
	  }
	  const spacingTime = 20 // 设置循环的间隔时间  值越小消耗性能越高
	  let spacingInex = time / spacingTime // 计算循环的次数
	  let nowTop = document.body.scrollTop + document.documentElement.scrollTop // 获取当前滚动条位置
	  let everTop = (number - nowTop) / spacingInex // 计算每次滑动的距离
	  let scrollTimer = setInterval(_ => {
		if (spacingInex > 0) {
		  spacingInex--
		  this.ScrollTop(nowTop += everTop)
		} else {
		  clearInterval(scrollTimer) // 清除计时器
		}
	  }, spacingTime)
	}
  }
}
</script>

<style scoped lang="scss">
.header {
  height: 90rpx;
  background: #f5f5f5;
  color: #fff;
  position: fixed;
  left: 0;
  right: 0;
  /* #ifdef APP-PLUS */
	top: 0;
	padding-top: 60rpx;
  /* #endif */
  /* #ifdef H5 */
	top: 0;
  /* #endif */
  /* #ifdef MP-WEIXIN */
	height: 120rpx;
	padding-top: 40rpx;
  /* #endif */
  text-align: center;
  display: flex;
  align-items: center;
  z-index: 2;
  flex: 1;
  font-size: 16px;
  .header-left {
    height: 90rpx;
    display: flex;
    align-items: center;
    margin-left: 30rpx;
    flex: 1;
    .header-icon {
      width: 22rpx;
      height: 36rpx;
      background: url('./img/back.png') no-repeat;
      background-size: contain;
    }
	.left_text {
		color: #000;
	}
  }
  .title {
    font-size: 16px; /*no*/
    font-weight: 400;
    line-height: 90rpx;
    height: 90rpx;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	color: #000;
  }
  .header-right {
    height: 90rpx;
    line-height: 90rpx;
    flex: 1;
    text-align: right;
    padding-right: 30rpx;
  }
}
</style>
